// 新增危大工程和不涉及

<template>
    <f7-page class="add">
        <f7-navbar>
            <f7-nav-left>
                <f7-link back
                         icon-material="arrow_back"></f7-link>
            </f7-nav-left>
            <f7-nav-title>危大工程</f7-nav-title>
            <f7-nav-right>
                <f7-icon f7="house"
                         @click.native="fnToHome()"></f7-icon>
            </f7-nav-right>
        </f7-navbar>

        <van-notice-bar background="#fff"
                        color="#345">
            <f7-icon solt="left-icon"
                     color="#3385ff"
                     f7="layers_alt_fill"></f7-icon>
            <span>{{models.engineeInfo.engineeName}}</span>
        </van-notice-bar>

        <!-- 不涉及 -->
        <template v-if="models.model.isDanger == 0">
            <van-form ref="form">
                <van-field v-model="models.model.notDangerReason"
                           class="textarea-item"
                           type="textarea"
                           :rules="[{'required': true}]"
                           label="不涉及原因"
                           placeholder="请输入">
                </van-field>
            </van-form>
        </template>

        <!-- 不涉及 end -->

        <!-- 危大工程 -->
        <van-form input-align="right"
                  ref="form"
                  v-else>
            <van-field name="radio"
                       required
                       label="类型">
                <van-radio-group slot="input"
                                 v-model="models.model.isDanger"
                                 direction="horizontal">
                    <van-radio :name="1">危大工程</van-radio>
                    <van-radio :name="2">超危大工程</van-radio>
                </van-radio-group>
            </van-field>

            <!-- <van-field v-model="models.model.riskLevelName"
                       v-if="models.model.isDanger == 2"
                       readonly
                       required
                       label="风险等级">
                <div slot="input">
                    <v-picker-div placeholder="请选择"
                                  :columns="controlData.riskLevelEnums"
                                  :assignment="models.model"
                                  :rules="[{'required': true}]"
                                  code="riskLevelCode"
                                  name="riskLevelName">
                    </v-picker-div>
                </div>
            </van-field> -->

            <van-field v-model="models.model.module"
                       label="名称"
                       required
                       :rules="[{'required': true}]"
                       placeholder="请输入">
            </van-field>

            <van-field v-model="models.model.riskTypeName"
                       readonly
                       required
                       label="类别">
                <div slot="input">
                    <v-picker-div placeholder="请选择"
                                  :columns="controlData.riskTypeEnums"
                                  :assignment="models.model"
                                  code="riskTypeCode"
                                  name="riskTypeName"
                                  :defCheck="models.model.riskTypeCode"
                                  :rules="[{'required': true}]">
                    </v-picker-div>
                </div>
            </van-field>

            <v-dynamic-forms :valueList="models.valueList"
                             :typeList="typeList"
                             :riskListId="models.model.riskListId"
                             :confList="confList">
            </v-dynamic-forms>

            <van-field v-model="models.model.riskStatusName"
                       readonly
                       required
                       label="施工状态"
                       placeholder="请选择">
                <div slot="input">
                    <v-picker-div placeholder="请选择"
                                  :columns="controlData.riskStatusEnums"
                                  :assignment="models.model"
                                  :defCheck="models.model.riskStatusCode"
                                  :rules="[{'required': true}]"
                                  code="riskStatusCode"
                                  name="riskStatusName">
                    </v-picker-div>
                </div>
            </van-field>

            <van-field readonly
                       clickable
                       :value="models.model.startDate"
                       label="计划开工日期"
                       placeholder="请选择"
                       right-icon="tosend"
                       required
                       :rules="[{'required': true}]"
                       @click="calendarShow1 = true">
            </van-field>
            <van-calendar v-model="calendarShow1"
                          color="#3385ff"
                          get-container="body"
                          @confirm="onConfirm3">
            </van-calendar>

            <van-field readonly
                       clickable
                       :value="models.model.endDate"
                       label="计划完工日期"
                       placeholder="请选择"
                       right-icon="tosend"
                       required
                       :rules="[{'required': true}]"
                       @click="calendarShow2 = true">
            </van-field>
            <van-calendar v-model="calendarShow2"
                          color="#3385ff"
                          get-container="body"
                          @confirm="onConfirm4">
            </van-calendar>

            <van-field label="施工方案"
                       class="file-field"
                       required
                       input-align="left">
                <qm-file-upload slot="input"
                                ref="plan"
                                uploadId="riskList_plan"
                                :galleryOptions="{ multiple: true, maximum: 9 }"
                                :params="{type:'attach', dataKey: models.model.riskListId, bizType: 'riskList_plan'}">
                </qm-file-upload>
            </van-field>

            <van-field v-show="models.model.isDanger == 2"
                       label="论证报告"
                       class="file-field"
                       required
                       input-align="left">
                <qm-file-upload slot="input"
                                ref="report"
                                uploadId="riskList_report"
                                :galleryOptions="{ multiple: true, maximum: 9 }"
                                :params="{type:'attach', dataKey: models.model.riskListId, bizType: 'riskList_report'}">
                </qm-file-upload>
            </van-field>
        </van-form>
        <!-- 危大工程 end -->

        <f7-toolbar position="bottom"
                    no-shadow
                    v-has="'risk:riskList:save'"
                    class="fff">
            <f7-button fill
                       class="submit-btn"
                       @click="fnSubmit()">提交</f7-button>
        </f7-toolbar>
    </f7-page>
</template>

<script>
import controller from "@/libs/framework/workflowController"
import vDynamicForms from "./components/v-dynamic-forms/index.vue"

export default class instance extends controller {
    onBeforeInit () {
        this.urls = {
            model: '/risk/riskList/getWorkflowViewModel',
            save: '/risk/riskList/processSave'
        }
    }
    mixin () {
        return {
            components: {
                vDynamicForms
            },
            data () {
                return {
                    models: {
                        // 危大工程信息
                        model: {},
                        // 基坑等动态信息
                        valueList: [],
                        // 项目信息
                        engineeInfo: {}
                    },
                    controlData: {

                    },
                    typeList: [],
                    confList: [],
                    selectUser: {
                        selectComment: null,
                        comment: null,
                        comments: [],
                        tran: [],
                        activity: "",
                        users: [],
                    },

                    calendarShow1: false,
                    calendarShow2: false
                }
            },
            methods: {
                onConfirm3 (date) {
                    this.models.model.startDate = this.$formatter.formatStartDateTime(date)
                    this.calendarShow1 = false
                },
                onConfirm4 (date) {
                    this.models.model.endDate = this.$formatter.formatStartDateTime(date)
                    this.calendarShow2 = false
                },
                // 提交
                fnSubmit () {
                    if (this.models.model.isDanger == 0) {
                        if (!this.models.model.notDangerReason) {
                            this.$toast("请填写不涉及原因")
                            return false
                        }

                        this.send()
                    } else {
                        this.$refs.form.validate().then(_ => {
                            if (this.$refs.plan.getUploadedCount() < 1) {
                                this.$toast("请上传施工方案")
                                return false
                            }

                            if (this.models.model.isDanger == 2 && this.$refs.report.getUploadedCount() < 1) {
                                this.$toast('请上传论证报告')
                                return false
                            }

                            this.send()
                        }).catch(err => {
                            console.log(err)
                        })
                    }

                }
            },
            watch: {
                // 类型选择
                "models.model.riskTypeCode": function (val, old) {
                    if (val && val !== old) {
                        this.$util.request('/risk/riskList/getFormList', {
                            riskType: val
                        }, 'post').then(res => {
                            if (res.status == 200) {
                                this.confList = res.data.confList
                                this.typeList = res.data.typeList
                            }
                        })
                    }
                }
            }
        }
    }
}
</script>

<style lang="less" scoped>
@deep: ~">>>";

.add {
    .submit-btn {
        flex: 1;
        margin: 0 10px;
    }

    .file-field {
        flex-direction: column;
    }

    @{deep}.v-picker-div {
        padding: 0;
    }

    .textarea-item {
        flex-direction: column;

        > label {
            margin-bottom: 10px;
            width: auto;
            line-height: 18px;
            color: #888;
        }

        @{deep}textarea {
            padding: 10px;
            border: 1px solid #dbdbdb;
            border-radius: 4px;
        }
    }

    @{deep}input.van-field__control {
        color: #0f1826;
    }
}
</style>
